<!-- html表单标签 -->
<!-- 表单标签使用在数据的提交上 -->
<!-- 
    实现前端页面的请求
    在页面上获取到某一些数据,需要把这些数据提交到后端(JAVA)
    在前端并不是所有的标签都能请求后端
    1、超链接 a标签  是get请求 请求参数是拼接在url上
     <a href="后台的url"></a>
     url:localhost:8080/student/add;
     servlet doGet/doPost方法
     uri:student/add
    在url上拼接请求参数(get请求)：
        localhost:8080/student/add?参数名=参数值&参数名=参数值
    2、表单 添加数据的表单提交数据，表单数据提交成功以后页面会跳转
    提交成功以后return false; layui里面会经常使用。
    但是，在后期写项目的时候咱们不会使用原生的表单标签。
    会使用第三方的前端框架来写表单，这些表单也是写的原生的表单标签，自是它们提供了css样式
-->

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 
        表单标签里面所有的标签需要使用form标签包着
        form的 属性
            action：标签点提交按钮以后跳转到的地址
            method：标签的请求方式  get/post
     -->
    <form action="" method="post">

        <!-- 所有的输入框都是使用input标签，
            通过type属性值设置各种输入框 
            name：输入框的名称，并且后台是通过这个name属性的值来
            获取你在输入框里面输入的内容
            placeholder：设置输入框的提示语
            HttpServletRequest request
            String userName = request.getParameter("userName");
            HttpServletResponse response

            框架SpringMVC  获取参数 定义方法的参数 响应：return
        -->
        <!-- 文本输入框 -->
        姓名： <input type="text" name="userName" placeholder="请输入用户名" value="张三">
        <!-- 密码输入框 -->
        密码：<input type="password">
        <!-- 隐藏框 -->
        <input type="hidden" name="" value="">

        <!-- 文件上传 -->
        <input type="file">

        <!-- 按钮 -->
        <button>按钮</button>
        <input type="button" value="按钮">

        <!-- 
        单选按钮 
        一组单选按钮的name需要一致，或者不会实现单选的效果
        后台获取单选按钮的值，是获取的单选按钮的value 
        默认选项被选中 在标签里面直接写checked
        如果是通过js来设置是否被选中需要写成checked="checked"
       -->
        男：<input type="radio" name="sex" value="1" checked>
        女：<input type="radio" name="sex" value="0">

        <!-- 
        多选按钮 type：checkbox
        一组多选按钮其name也需要一致。然后在后台通过name来获取的
        由于对选按钮一次可以选中多个。所以在后台获取的数据是一个
        一维数组。并且后台获取多选按钮的值，是获取的多选按钮的value 
        默认选项被选中 在标签里面直接写checked
        如果是通过js来设置是否被选中需要写成checked="checked"
       -->

        篮球：<input type="checkbox" name="hobby" value="篮球" checked>
        足球：<input type="checkbox" name="hobby" value="足球" checked>
        网球：<input type="checkbox" name="hobby" value="网球">

        <!-- 提交按钮 -->
        <input type="submit" value="提交">
        <!-- 重置按钮 注意：重置按钮需要方法form标签里面才有效果-->
        <input type="reset" value="重置">


        <!-- 颜色选择器 -->
        <input type="color" name="" id="">

        <!-- 日期 -->
        <input type="datetime-local" name="" id="">

        <!-- 
            下拉列表 只能选中一项 
            select里面的name属性是后台来获取你选择的数据的属性
            后台获取你选择的是哪一个数据，这个数据是在option里面的value来定义的。
            通过 selected  设置默认被选中
        -->
        <select name="course">
            <option value="">----请选择----</option>
            <option value="">java</option>
            <option value="" selected>html</option>
            <option value="">css</option>
            <option value="">javascript</option>
        </select>

        <!-- 下拉列表多选的效果 需要在select中加属性multiple-->
        <select name="course" multiple="multiple">
            <option value="">----请选择----</option>
            <option value="">java</option>
            <option value="" selected>html</option>
            <option value="">css</option>
            <option value="">javascript</option>
        </select>

        <!-- 文本域   cols：列  rows：行-->  
        <textarea name="" id="" cols="30" rows="50">

        </textarea>
    </form>

</body>

</html>